<template>
	<view>
		<view class="top_text">商品管理</view>
		<view>
			<view style="margin-top: 25px;">
				<uni-list>
					<uni-list-item  >
						<template slot="footer" @click="biu(1)">
							<uni-icons type="arrowright" color="#8F8F94"></uni-icons>
						</template>
						<template slot="header" >
							<view  class="text">书写工具</view>
							<image src="../../../static/pen.png" class="img"></image>
						</template>
					</uni-list-item>
				</uni-list>
				<view v-for="(item,key) in goods" :key="key">
					<uni-list v-show="item['goodscategory']==='书写工具'">
						<uni-list-item :thumb="item['goodspicture']" thumbSize="base">
							<template slot="body" class="temp" @tap="getClicked(item['goodsid'])">
								<text class="temp_text1">名称：{{item['goodsname']}}</text>
								<text class="temp_text2">价格：{{item['goodsprice']}}</text>
								<text class="temp_text3">库存：{{item['goodsstock']}}</text>
								<text class="temp_text4">规格：{{item['goodsstandard']}}</text>
							</template>
						</uni-list-item>
					</uni-list>
				</view>
				
			</view>
			<view>
				<uni-list>
					<uni-list-item>
						<template slot="footer" @click="biu(2)">
							<uni-icons type="arrowright" color="#8F8F94"></uni-icons>
						</template>
						<template slot="header">
							<view  class="text">纸张本册</view>
							<image src="../../../static/book.png" class="img"></image>
						</template>
					</uni-list-item>
				</uni-list>
				<view v-for="(item,key) in goods" :key="key">
					<uni-list v-show="item['goodscategory']==='纸张本册'">
						<uni-list-item :thumb="item['goodspicture']" thumbSize="base">
							<template slot="body" class="temp" @tap="getClicked(item['goodsid'])">
								<text class="temp_text1">名称：{{item['goodsname']}}</text>
								<text class="temp_text2">价格：{{item['goodsprice']}}</text>
								<text class="temp_text3">库存：{{item['goodsstock']}}</text>
								<text class="temp_text4">规格：{{item['goodsstandard']}}</text>
							</template>
						</uni-list-item>
					</uni-list>
				</view>
			</view>
			<view>
				<uni-list>
					<uni-list-item>
						<template slot="footer" @click="biu(3)">
							<uni-icons type="arrowright" color="#8F8F94"></uni-icons>
						</template>
						<template slot="header">
							<view  class="text">学习用品</view>
							<image src="../../../static/ruler.png" class="img"></image>
						</template>
					</uni-list-item>
				</uni-list>
				<view v-for="(item,key) in goods" :key="key">
					<uni-list v-show="item['goodscategory']==='学习用品'">
						<uni-list-item :thumb="item['goodspicture']" thumbSize="base">
							<template slot="body" class="temp" @tap="getClicked(item['goodsid'])">
								<text class="temp_text1">名称：{{item['goodsname']}}</text>
								<text class="temp_text2">价格：{{item['goodsprice']}}</text>
								<text class="temp_text3">库存：{{item['goodsstock']}}</text>
								<text class="temp_text4">规格：{{item['goodsstandard']}}</text>
							</template>
						</uni-list-item>
					</uni-list>
				</view>
			</view>
			<view>
				<view>
					<uni-list >
						<uni-list-item>
							<template slot="footer" @click="biu(4)">
								<uni-icons type="arrowright" color="#8F8F94"></uni-icons>
							</template>
							<template slot="header">
								<view  class="text">收纳整理</view>
								<image src="../../../static/收纳盒.png" class="img"></image>
							</template>
						</uni-list-item>
					</uni-list>
				</view>
				<view v-for="(item,key) in goods" :key="key">
					<uni-list v-show="item['goodscategory']==='收纳整理'">
						<uni-list-item :thumb="item['goodspicture']" thumbSize="base">
							<template slot="body" class="temp" @tap="getClicked(item['goodsid'])">
								<text class="temp_text1">名称：{{item['goodsname']}}</text>
								<text class="temp_text2">价格：{{item['goodsprice']}}</text>
								<text class="temp_text3">库存：{{item['goodsstock']}}</text>
								<text class="temp_text4">规格：{{item['goodsstandard']}}</text>
							</template>
						</uni-list-item>
					</uni-list>
				</view>
			</view>
			<view>
				<uni-list>
					<uni-list-item>
						<template slot="footer" @click="biu(5)">
							<uni-icons type="arrowright" color="#8F8F94"></uni-icons>
						</template>
						<template slot="header">
							<view  class="text">办公用品</view>
							<image src="../../../static/pen.png" class="img"></image>
						</template>
					</uni-list-item>
				</uni-list>
				<view v-for="(item,key) in goods" :key="key">
					<uni-list v-show="item['goodscategory']==='办公用品'">
						<uni-list-item :thumb="item['goodspicture']" thumbSize="base">
							<template slot="body" class="temp" @tap="getClicked(item['goodsid'])">
								<text class="temp_text1">名称：{{item['goodsname']}}</text>
								<text class="temp_text2">价格：{{item['goodsprice']}}</text>
								<text class="temp_text3">库存：{{item['goodsstock']}}</text>
								<text class="temp_text4">规格：{{item['goodsstandard']}}</text>
							</template>
						</uni-list-item>
					</uni-list>
				</view>
			</view>
		</view>
		<view>
			<view @click="navTo()" style="font-size: 25px; line-height: 25px; text-align: center;">新品上架</view>
		</view>
		<view style="height: 50px;"> </view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				goods:[
					{
						
					}
				],
				src:'../../../../../static/default_goods.png'
			}
		},
		methods: {
			biu(choice){
				let name='category';
				switch (choice){
					case 1:
						this.search='书写工具';
						break;
					case 2:
						this.search='纸张本册';
						break;
					case 3:
						this.search='学习用品';
						break;
					case 4:
						this.search='收纳整理';
						break;
					case 5:
						this.search='办公用品';
						break;
					default:
						break;
				}
				uni.navigateTo({
					url:'/pages/tabBar/goods/getGoods/getGoods?search='+this.search+'&name='+name
				}).then(res=>{
					console.log("jia");
				}).catch(err=>{
					console.log(err);
				})
			},
			getClicked(id){
				console.log(id);
				uni.navigateTo({
					url:'/pages/tabBar/goods/certaingoods/certaingoods?goodsid='+id
				}).catch(e=>{
					console.log(e)
				})
			},
			navTo(){
				uni.navigateTo({
					url:"../tabBar/goods/newgoods/newgoods"
				}).then((res)=>{
					console.log(res);
					console.log("为啥呢");
				}).catch(e=>{
					console.log(e);
				})
			}
		},
		beforeCreate(){
			const res=this.$myRequest({
				url:'/users/get_goodsinfo/',
				data:{
					"categories":["学习用品","纸张本册","书写工具","收纳整理","办公用品"]
				}
			}).then((response=>{
				console.log(response);
				this.goods=response.data
				let index;
				for(index=0;index<response.data.length;index++){
					let item=response.data[index]
					this.$myRequest({
						url:'/product/get_pict_url/',
						data:{
							"id":item['goodsid']
						}
					}).then(res=>{
						
						if(res.data.length==0){
							item.goodspicture=this.src;
						}else{
							item.goodspicture=res.data[0];
						}
					})
				}
			})).catch((error)=>{
				console.log(error);
			})
		}
	}
</script>

<style lang="scss">
	.top_text{
		font-size: 25px;
		line-height: 25px;
		margin-left: 15px;
		margin-top: 10px;
	}
	.zhanwei{
		height: 50px;
		background-color: white;
	}
	.text{
		display: inline-block;
		margin-right: 15px;
	}
	.img{
		width: 25px;
		height: 25px;
	}
	.temp{
		.temp_text1 {
				width: 100px;
				margin-right: 10px;
			    display: inline-block;
		}
		.temp_text2{
				width: 70px;
				margin-right: 10px;
			    display: inline-block;

		}
		.temp_text3{
			width: 70px;
			margin-right: 10px;
			display: inline-block;
		}
		.temp_text4{
			color: #8F8F94;
			width: 250px;
			margin-right: 10px;
			display: inline-block;
			   // overflow: hidden；
			   // white-space: nowrap；
			   // text-overflow: ellipsis；
			overflow: hidden;
			-webkit-line-clamp: 1;
			text-overflow: ellipsis;
			display: -webkit-box;
			-webkit-box-orient: vertical;
		}
	}
</style>
